{extend name="public/layout" /}
{block name="head_css"}
    <link rel="stylesheet" href="/static/index/css/detail_footer.css?v={$version}">
    <link rel="stylesheet" href="/static/index/css/detail_comment.css?v={$version}">
    <link rel="stylesheet" href="/static/index/css/detail_content.css?v={$version}">
    <style>
        .content-box {
            box-sizing: border-box;
            padding-top: 10px;
            padding-bottom: 10px;
            font-size: .9rem;
            background-color: #fff;
            border-radius: 1rem;
            margin-top: -1rem;
            margin-bottom: 10px;
        }
        #carousel {
            z-index: -1;
        }


    </style>
{/block}
{block name="main"}
<!-- 滚动图 -->
<div id="carousel" class="carousel slide" data-ride="carousel">
    <div class="carousel-inner" style="height: 300px">
        {foreach name="$vo.imgs" item="item" key="key"}
        <div class="carousel-item {if condition="$key eq 0"}active{/if}">
            <img style="height: 300px" class="d-block w-100" src="{$item.path}" alt="">
        </div>
        {/foreach}
    </div>
</div>
<!-- 滚动图 END -->

<!-- 详情内容 -->
<div class="container content-box">
    <div class="title-line">
        <div class="shotcut" >
            <img width="100%" src="{$vo.logo}">
        </div>
        <div class="content">
            <div class="title">{$vo.contacts}</div>
            <div class="other">
                <div class="icon"></div>
                <div class="read">{$vo.pv}次查看</div>
                <div class="icon date"></div>
                <div class="read">{$vo.update_time}</div>
            </div>
        </div>
    </div>
    <div class="html-wrapper">
        <p>地址：{$vo.address}</p>
    </div>
    <div class="html-wrapper">
        <p>	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{$vo.detail}</p>
    </div>
</div>
<!-- 详情内容 END -->

<!-- 评论列表 -->
<div class="container comment-box">
    <div class="item-line">
        <div class="title">用户评价({$vo.comment_num})</div>
        <div class="more">
            <a href="{:url('comment_list',array('id'=>$vo.id))}">查看全部&gt;&gt;&gt;</a>
        </div>
    </div>
    {foreach name="comment_list" item="item"}
    <div class="item-line">
        <div class="tel">{$item.uid}</div>
        <div class="comment-item">
            {foreach name="item.comment" item="comment"}
            <div class="citem">{$comment}</div>
            {/foreach}
        </div>
    </div>
    {/foreach}
</div>
<!-- 评论列表 END -->

<div class="container detail-footer">
    <a onclick="like_action(this)" class="like-btn {if condition='$is_like eq 1'}like-btn-like{/if}">
        <div class="icon"></div>
        <div id="like_num">({$vo.like_num})</div>
    </a>
    <a class="comment-btn" href="{:url('comment',array('id'=>$vo.id))}">
        <div class="icon"></div>
        <div class="words">我要评论</div>
    </a>
    <a href="tel:{$vo.mobile}" class="submit-btn">
        <div class="icon"></div>
        <div class="words">拨打电话</div>
    </a>
</div>
{/block}
{block name="footer"}
{/block}
{block name="script"}
<script>
    window.onload = function(){
        var seed = '{$seed}';
        var d = new Object();
        d.seed = seed;
        d.id = {$vo.id};
        $.post('{:url('add_pv')}',d,function () {

        })
    };
    function like_action(obj){
        if($(obj).hasClass('like-btn-like')){
            var url = '{:url('unlike')}';
        }else{
            var url = '{:url('like')}'
        }
        var d = new Object();
        d.id = {$vo.id};
        $.post(url,d,function(res){
            if(res.code == 1){
                $('#like_num').text(res.data.like_num);
                if($(obj).hasClass('like-btn-like')){
                    $(obj).removeClass('like-btn-like');
                }else{
                    $(obj).addClass('like-btn-like');
                }
            }else if(res.code == -2){
                alert('请先登录');
                window.location.href = '{:url('/index/login/index')}'
            }else{
                alert(res.msg);
            }
        })
    }
    $('.carousel').carousel({
        interval: 2000
    });

    $('.carousel').hammer().on('swipeleft', function(){
        $(this).carousel('next');
    });

    $('.carousel').hammer().on('swiperight', function(){
        $(this).carousel('prev');
    });
</script>
{/block}